<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      /* 在css里面 [] 选择器就是找标签的属性的 */
      /* 先在div标签里面去找 有没有name属性的 如果有 就给它们设置对应的样式 */
      /* div[name] {
        border: 1px solid #000;
      } */

      /* div[name="abcd"] {
          border: 1px solid #f00;
      } */
      /* 先找到 div标签 找div标签里面的 name属性 如果它的属性值是以 abcd开头的元素则匹配到 */
      /* div[name^="abcd"] {
          color: red;
      } */
      /* 先找到 div标签 找div标签里面的 name属性 如果它的属性值是以 1234结尾的元素则匹配到 */
      div[name$='1234'] {
        color: red;
      }
    </style>
  </head>
  <body>
    <div name>0001</div>
    <div name="abcd1234">0002</div>
    <div name="abcd1234">0003</div>
    <div name="abcd1234">0004</div>
    <div name="abcd">0005</div>
    <hr />
    <span name>aaaaa</span>

    <!-- a[href="http://www.baidu.com"][target="_blank"] -->
  </body>
</html>
